import { Badge,Card,NoticeBar,Dialog,Button,Scroller,Popup,Group,Field,Toast,NumberPicker,Context,SelectField,Layer} from 'saltui';
import './PageHome.less';
import './popup.less';
import './group.less';

import Icon from 'salt-icon';

import Lang from './Lang';
import  HTab  from '../../../../Common/Tab';
import  Ajax  from '../../../../Common/Ajax';
import  HDialog  from '../../../../Common/HDialog';
import  List  from '../../../Common/form/List';
import  TableEdit  from '../../../common/form/diy/TableEdit';
import roomSettingMock  from "../../../mock/roomSettingMock";
import MockTool from "../../../mock/MockTool";

import $ from 'jquery'



export default class RoomSetting  extends React.Component {

  constructor(props) {
    super(props);
    this.id = 0;
    this.typeObj = null ;
    this.data = null;
    this.type =null;
    this.option = null;
    this.state = {
      layer:{
        add:{
          show:false
        }
      },


    };
    this.state.columns =  MockTool.getType(roomSettingMock,this.id,'columns');
    this.state.type =  MockTool.getType(roomSettingMock,this.id,'button');
    this.roomType = [
      {id:1,name:'房屋类型',url:"roomtype/lists",del:(id,key)=>{

        let that = this;
        HDialog.confirm(this,'删除房屋类型','是否删除房屋类型',function(){
          Ajax.post("roomtype/del",{id:id},that.sussceList);
        });

      }},
      {id:2,name:'设施',url:"room/setting/amenities/lists",del:(id,key)=>{
        let that = this;
        HDialog.confirm(this,'删除设施','是否删除设施',function(){
          Ajax.post("room/setting/amenities/del",{id:id},that.sussceList);
        });

      }},

    ]

  }

  localSuccess = (data) =>{
    this.option = data;
  }

  componentDidMount() {
    Ajax.post("local/lists",{opetion_type:['tax','tip','payment','amenities']},this.localSuccess);
    this.handSwitchType(0);
  }

  /** method  ----------------------------------  */

  _initList =(id) =>{

    let ids = this.roomType[0];
    if(typeof this.roomType[id]  !='undefined'){
      ids = this.roomType[id];
    }
    Ajax.post(ids.url,{},this.sussce);
  }

  _button (id){
    let type = this.type;

    let Form =  require("../../../common/form/sub/"+type);
    let data =  $.extend(true,{option:this.option},{buttonName:"新增", onChange:this.changeInit,typeid:this.id});

    return  React.createElement(Form, data)
  }

  sussce = (data) =>{
    this.data = data;
    this.typeObj = this._button();

    let ids = this.roomType[this.id];
    let that = this;
    data.map(function(value,index){
      let rowData = data[index];
      data[index]['eidt'] = <TableEdit option={that.option} typeid={that.id} data={rowData}  typeObj={that.typeObj} onChange = {that.changeInit} id={that.id}  type={that.type}  id={data[index].id}  del={ids.del} />;
    })
    this.setState({
      data:data
    })

  }

  sussceList = (data) =>{
    this._initList(this.id);
  }

  changeInit=(id) =>{
    this._initList(id);
  }

  handSwitchType = (id,event) => {
    let columns = MockTool.getType(roomSettingMock,id,'columns');
    let type =  MockTool.getType(roomSettingMock,id,'button');
    this.id = id;
    this.type = type;
    this.setState({id: id});
    this.setState({columns: columns});
    this.setState({type: type});
    this._initList(id);

  }


  render(){


    return (
      <div className="card-wrap">
        <Card className="card-example t-MT10 setting-card">
          <div className="t-MB10 t-ML10   lineByRem"><h1 className="t-PT10">财务配置</h1></div>
          <hr/>

          <HTab roomType={this.roomType} onTabClick={this.handSwitchType}  active={'0'} />
          <List  typeObj={this.typeObj} onChange={this.changeInit} type ={this.state.type} id={this.id} data={this.state.data}  columns={this.state.columns} />

        </Card>

      </div>
    );
  }
}
